import React, {useEffect, useState} from 'react';
import {Space, Switch, Table,Button} from "antd";
import {getHospitalList} from "@/api/hosp";

function Index() {
    // 定义保存医院列表的数据状态
    const [hospitalList,setHospitalList] = useState([]);
    // 定义保存页码信息的数据状态
    const [pageInfo,setPageInfo] = useState({
        current:1,
        pageSize:1,
        total:1
    })
    // 加载中
    const [loading,setLoading] = useState(false);
    const getHospitalListAsync = async function(current:number=1,pageSize:number=4){
        setLoading(true);
        const {data} = await getHospitalList(current,pageSize);
        setHospitalList(data.content);
        setPageInfo({
            current:data.number+1,
            pageSize:data.size,
            total:data.totalElements
        })
        setLoading(false);


        // getHospitalList(1,4).then((values:any)=>{
        //     setHospitalList(values.data.content);
        //     setPageInfo({
        //         current:values.data.number+1,
        //         pageSize:values.data.size,
        //         total:values.data.totalElements
        //     })
        // })
    }
    useEffect(()=>{
        getHospitalListAsync();
    },[])
    return (
        <div id={"content"}>
            <Table
                loading={loading}
                pagination={{
                    ...pageInfo,
                    // onChange(current,pageSize){
                    //     // console.log(current,pageSize);
                    //     getHospitalListAsync(current,pageSize);
                    // },
                    // 以上代码同以上代码作用相同
                    onChange:getHospitalListAsync

                }}
                scroll={{x:1500}}
                rowKey={"id"}
                bordered={true}
                columns={[
                    {
                        title:"序号",
                        align:"center",
                        render(value,rows,index){
                            return (pageInfo.current-1)*pageInfo.pageSize+index+1;
                        }
                    },{
                        title:"医院名称",
                        align:"center",
                        dataIndex:"hosname"
                    },{
                        title:"医院编号",
                        align:"center",
                        dataIndex:"hoscode"
                    },{
                       title:"医院LOGO",
                       align:"center",
                       dataIndex:"logoData",
                        render(logoData){
                           return (
                               <img height={50} src={"data:image/png;base64,"+logoData} alt=""/>
                           )
                        }
                    },{
                        title:"是否上线",
                        align:"center",
                        dataIndex:"status",
                        // （0：未上线 1：已上线）
                        render(status){
                            return (
                                <Switch checked={status===1}/>
                            )
                        }
                    },{
                        title:"医院等级",
                        align:"center",
                        dataIndex:"param",
                        render(param){
                            return param.hostypeString;
                        }
                    },{
                        title:"医院地址",
                        align:"center",
                        dataIndex:"param",
                        render(param){
                            return param.fullAddress;
                        }
                    },{
                        title:"创建时间",
                        align:"center",
                        dataIndex:"createTime"
                    },{
                        title:"操作",
                        align:"center",
                        fixed:"right",
                        render(){
                            return (
                                <Space>
                                    <Button type={"primary"}>查看</Button>
                                    <Button type={"primary"}>排班</Button>
                                </Space>
                            )
                        }
                    }
                ]}
                dataSource={hospitalList}
            />
        </div>
    );
}

export default Index;